<template>
    <div>
        <el-form ref="Maintenance_ref" :model="Maintenance" label-width="100px">
            <el-row :gutter="20">
                <el-col :span="8">
                    <el-form-item label="记录编号" prop="MaintenanceNumber">
                        <el-input v-model="Maintenance.MaintenanceNumber"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="维修人" prop="UserId">
                        <el-select v-model="Maintenance.UserId" style="width: 100%">
                            <el-option v-for="v in $store.state.AllUsers" :value="v.Id" :label="v.UserName"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="维修类型" prop="MaintenanceType">
                        <el-select v-model="Maintenance.MaintenanceType" style="width: 100%">
                            <el-option :value="1" label="设备"></el-option>
                            <el-option :value="2" label="汽车"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="8">
                    <el-form-item label="维修物品" prop="MaintenanceId">
                        <el-select v-model="Maintenance.MaintenanceId" style="width: 100%">

                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="开始时间" prop="StartDate">
                        <el-date-picker style="width: 100%" placeholder="开始时间"
                                        type="date"
                                        format="yyyy-MM-dd"
                                        v-model="Maintenance.StartDate"></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="结束时间" prop="EndDate">
                        <el-date-picker style="width: 100%" placeholder="开始时间"
                                        type="date"
                                        format="yyyy-MM-dd"
                                        v-model="Maintenance.EndDate"></el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="8">
                    <el-form-item label="维修地址" prop="RepairSite">
                        <el-input v-model="Maintenance.RepairSite"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="维修原因" prop="MaintenanceReasons">
                        <el-input v-model="Maintenance.MaintenanceReasons"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="维修金额" prop="MaintenanceAmount">
                        <el-input v-model="Maintenance.MaintenanceAmount"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col :span="8">
                    <el-form-item label="维修状态" prop="State">
                        <el-select  v-model="Maintenance.State" style="width: 100%">
                            <el-option :value="1" label="正在维修"></el-option>
                            <el-option :value="2" label="维修完毕"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="16">
                    <el-form-item label="备注" prop="Remark">
                        <el-input v-model="Maintenance.Remark"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row :gutter="20">
                <el-col align="center">
                    <el-button type="warning" @click="AddMaintenance_event">添加记录信息</el-button>
                    <el-button type="info" @click="formresetFields_event">重置</el-button>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
    export default {
        name: "AddMaintenance",
        data() {
            return {
                Maintenance: {
                    MaintenanceNumber: '',
                    UserId: '',
                    MaintenanceType: '',
                    MaintenanceId: '',
                    StartDate: '',
                    EndDate: '',
                    MaintenanceReasons: '',
                    MaintenanceAmount: '',
                    RepairSite: '',
                    State: '',
                    Remark: '',
                    OperatId: 0,
                    OperatDate: new Date(),
                    Delete: false,
                }
            }
        },
        methods: {
            //重置表格
            formresetFields_event() {
                this.$refs['Maintenance_ref'].resetFields()
            },
            // 添加维修记录
            AddMaintenance_event() {
                let loadding = this.openLoading();
                this.$http.post('Maintenance/AddMaintenanceContent', this.Maintenance).then(res => {
                    loadding.close();
                    if (res) {
                        this.$message.success('添加成功!')
                        this.formresetFields_event()
                        this.$parent.$parent.AddMaintenance_dialog = false
                        this.$parent.$parent.formdata()

                    } else {
                        this.$message.warning('添加失败,请重试!')
                    }
                })
            },
        }
    }
</script>

<style scoped>

</style>
